<template>
  <el-dialog title="编辑产品" width="900px" :close-on-click-modal="false" @open="initData"  v-model="props.infoDialog" @close="cancelForm" v-dialogDrag>
    <el-form :model="formData.form" label-width="120px">
      <el-form-item label="所属项目集">
        <!--<el-input v-model="formData.form.parent" />-->
        <el-select v-model="formData.form.parent" clearable placeholder="请选择" :disabled="formData.form.id>0">
          <el-option
            v-for="item in formData.setOptions"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="产品名称">
        <el-input v-model="formData.form.name" />
      </el-form-item>
      <el-form-item label="产品代号">
        <el-input v-model="formData.form.code" />
      </el-form-item>
      <el-form-item label="产品负责人">
        <el-select v-model="formData.form.po" clearable placeholder="请选择">
          <el-option
            v-for="item in formData.userOptions"
            :key="item.id"
            :label="item.nickname"
            :value="item.account"
          />
        </el-select>
        <!--<el-input v-model="formData.form.po" />-->
      </el-form-item>
      <el-form-item label="测试负责人">
        <el-select v-model="formData.form.qd" clearable placeholder="请选择">
          <el-option
            v-for="item in formData.userOptions"
            :key="item.id"
            :label="item.nickname"
            :value="item.account"
          />
        </el-select>
        <!--<el-input v-model="formData.form.qd" />-->
      </el-form-item>
      <el-form-item label="发布负责人">
        <el-select v-model="formData.form.rd" clearable placeholder="请选择">
          <el-option
            v-for="item in formData.userOptions"
            :key="item.id"
            :label="item.nickname"
            :value="item.account"
          />
        </el-select>
        <!--<el-input v-model="formData.form.rd" />-->
      </el-form-item>
      <el-form-item label="评审人">
        <el-select
          v-model="formData.form.feedbackArr"
          multiple
          filterable
          allow-create
          default-first-option
          :reserve-keyword="false"
          placeholder="可选择多个"
        >
          <el-option
            v-for="item in formData.userOptions"
            :key="item.id"
            :label="item.nickname"
            :value="item.account"
          />
        </el-select>
        <!--<el-input v-model="formData.form.feedback" />-->
      </el-form-item>
      <el-form-item label="产品类型">
        <el-radio-group v-model="formData.form.type">
          <el-radio label='normal' >正常</el-radio>
          <el-radio label='branch' >多分支</el-radio>
          <el-radio label='terrace' >多平台</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="产品状态">
        <el-radio-group v-model="formData.form.status">
          <el-radio label='normal' >正常</el-radio>
          <el-radio label='closed' >结束</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="产品描述">
        <el-input v-model="formData.form.desc" type="textarea" />
      </el-form-item>
      <el-form-item label="访问控制">
        <el-radio-group v-model="formData.form.acl">
          <el-radio label='private' >私有(产品相关负责人、所属项目集的负责人及干系人、相关联项目的团队成员和干系人可访问)</el-radio>
          <el-radio label='open' >公开(有产品视图权限，即可访问)</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
        <el-button @click="cancelForm" >关闭</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>


</template>

<script setup>
  import { computed, ref,onMounted ,reactive,defineProps,defineEmits} from 'vue'
  import {ProductGetById,ProductSaveOrUpdate ,ProjectSetSelect} from '@/api/project'
  import {userSelect} from '@/api/user'
  import { ElMessage } from 'element-plus';


  let props = defineProps({
    infoDialogData:{                            // 父组件v-model绑定的值
      type:Object,
    },
    infoDialog:{
      type: Boolean,
    }
  });

  const formData = reactive({
    form:{},
    setOptions:[],
    userOptions:[]
  })

  const initData=()=>{
    formData.form=props.infoDialogData;
    ProjectSetSelect().then(res=>{
      if(res.code==200){
        formData.setOptions=res.data;
      }
    })
    userSelect().then(res=>{
      if(res.code==200){
        formData.userOptions=res.data;
      }
    })
  }


  //提交项目集
  const onSubmit = () => {
    let  param=formData.form;
    param.feedback=param.feedbackArr.join();
    ProductSaveOrUpdate(param).then(res=>{
      if(res.code==200){
        ElMessage.success("数据配置成功!");
        emits('renovate');
        cancelForm();
      }
    })
  }

  // 2、定义发射给父组件的方法
  const emits = defineEmits(['update:infoDialog','renovate'])

  const cancelForm=()=>{
    emits('update:infoDialog',false);
  }







</script>
